//Variables
@img: "/static/img/";
@space: 12px;
@spaceV: 10px;
@red: #ed0000;
@grey: #959595;
@blue: #4a90e2;
@red: #ed0000;
@black: #000;
@white: #fff;

//mixins
.tac(){
  text-align: center;
}
.oh(){
  overflow: hidden;
}
.pr(){
  position: relative;
}
.pa(){
  position: absolute;
}
.bz(){
  box-sizing: border-box;
}

.bg(@bg: #fff){
  background-color: @bg;
}
.circle(@size: 30px){
  width: @size;
  height: @size;
  line-height: @size;
  .br;
  .tac;
}
.square(@size: 44px;){
  width: @size;
  height: @size;
}
.flex(@wrap: nowrap; @d: row; @v: center; @h: center;){
  display: flex;
  flex-direction: @d;
  flex-wrap: @wrap;
  align-items: @v;
  justify-content: @h;
}
.font(@font: 15px){
  font-size: @font;
}
.format(@font: 16px; @color: #fff) {
  font-size: @font;
  color: @color;
}
.bgSize(@w: auto; @h: auto) {
  background-repeat: no-repeat;
  background-size: @w @h;
}
.br(@r: 50%){
  border-radius: @r;
}


//common style
.wrapper{
  height: 100%;
  box-sizing: border-box;
  overflow-x: hidden;
  overflow-y: auto;
}